<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
	</head>
	<body>
		<canvas id="canvas" style="border: 1px solid red;"></canvas>
		<script type="text/javascript">
			window.onload = function() {
				var canvas = document.getElementById("canvas")
				var cxt = canvas.getContext("2d")
				canvas.width = 550;
				canvas.height = 400;
				
				//创建img对象
				var img = new Image()
				img.src = "img/tiger.png"
				
				//图片对象必须加载后才可以使用
				img.onload = function() {
					cxt.drawImage(img, 50, 50)
				}
				
			}
		</script>
	</body>
</html>
